{% extends 'main/base.html' %}

{% block title %}Login{% endblock title %}

{% block body %}
    {% if wrong_cred_message %}
    <div class="alert alert-danger alert-dismissible" role="alert">
        <strong>{{ wrong_cred_message }}</strong> : Please enter correct credentials
        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
    </div>
    {% endif %}

    <div id="login">
        <h1 class="text-center text-black pt-5">Welcome to our Portal</h1>
        <div class="container">
            <div id="login-row" class="row justify-content-center align-items-center">
                <div id="login-column" class="col-md-6">
                    <div id="login-box" class="col-md-12">
                        <form id="login-form" class="form" action="" method="post">
                            {% csrf_token %}
                            <div class="form-group" align='center'>
                                <h3><label for="username" class="text-info">Username:</label><br></h3>
                                <input type="text" name="username" id="username" class="form-control">
                            </div>
                            <div class="form-group" align='center'>
                                <h3><label for="password" class="text-info">Password:</label><br></h3>
                                <input type='password' name="password" id="password" class="form-control">
                            </div>
                            <div align='center' class="form-group">
                                <input type="submit" name="submit" class="btn btn-success btn-md" value="Login">
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock body %}